/* Skins
-------------------------- */
$skin--blue     : #3E8EF7;
$skin--brown    : #997B71;
$skin--cyan     : #0BB2D4;
$skin--gray     : #757575;
$skin--green    : #11C26D;
$skin--indigo   : #667AFA;
$skin--orange   : #EB6709;
$skin--pink     : #F74584;
$skin--purple   : #9463F7;
$skin--red      : #FF4C52;
$skin--turquoise: #17B3A3;
$skin--yellow   : #FCB900;
$skins: (
  'blue'     : $skin--blue,
  'brown'    : $skin--brown,
  'cyan'     : $skin--cyan,
  'gray'     : $skin--gray,
  'green'    : $skin--green,
  'indigo'   : $skin--indigo,
  'orange'   : $skin--orange,
  'pink'     : $skin--pink,
  'purple'   : $skin--purple,
  'red'      : $skin--red,
  'turquoise': $skin--turquoise,
  'yellow'   : $skin--yellow
);
 

/* Element-ui theme color and Aui skin color
-------------------------- */
$--color-primary: $skin--orange !default;


/* Colors
-------------------------- */
$color--white: #fff;
$color--black: #000;
$color--primary        : $--color-primary;
$color--primary-light-1: mix($color--white, $color--primary, 10%);
$color--primary-light-2: mix($color--white, $color--primary, 20%);
$color--primary-light-3: mix($color--white, $color--primary, 30%);
$color--primary-light-4: mix($color--white, $color--primary, 40%);
$color--primary-light-5: mix($color--white, $color--primary, 50%);
$color--primary-light-6: mix($color--white, $color--primary, 60%);
$color--primary-light-7: mix($color--white, $color--primary, 70%);
$color--primary-light-8: mix($color--white, $color--primary, 80%);
$color--primary-light-9: mix($color--white, $color--primary, 90%);
$color--text-primary    : #303133;
$color--text-regular    : #606266;
$color--text-secondary  : #909399;
$color--text-placeholder: #c0c4cc;


/* Link
-------------------------- */
$link--color      : $color--primary-light-2;
$link--hover-color: $color--primary;


/* Border
-------------------------- */
$border--color-base       : #dcdfe6;
$border--color-light      : #e4e7ed;
$border--color-lighter    : #ebeef5;
$border--color-extra-light: #f2f6fc;
$border--hover-color: $color--text-placeholder;
$border--radius-sm  : 2px;
$border--radius-base: 4px;


/* Background
-------------------------- */
$bg--color-base: #f5f7fa;


/* Font
------------------------------ */
$font--family-base: "Helvetica Neue", Helvetica, "PingFang SC", "Hiragino Sans GB", "Microsoft YaHei", "微软雅黑", Arial, sans-serif;
$font--size-xs  : 12px;
$font--size-sm  : 13px;
$font--size-base: 14px;
$font--size-lg  : 16px;
$font--size-xl  : 18px;
$font--size-xxl : 22px;
$font--weight-base: 500;
$font--line-height-base: 1.15;


/* Header
------------------------------ */
$header--zindex: 1030;
$header--height: 50px;
$header--shadow: 0 1px 0 0 rgba(0, 0, 0, .05);
$brand--font-size: $font--size-xl;


/* Aside
------------------------------ */
$aside--zindex: 1020;
$aside--width: 230px;
$aside--shadow: 1px 0 0 0 rgba(0, 0, 0, .05);
$aside--width-fold: 60px;
$aside--menu-item-height: 40px;
$aside--text-color-dark: #8a979e;
$aside--background-color-dark: #263238;


/* Aside control
------------------------------ */
$aside-control--zindex: 1020;
$aside-control--width: 210px;
$aside-control--shadow: -1px 0 0 0 rgba(0, 0, 0, .05);


/* Main
------------------------------ */
$main--background-color: #f1f4f5;
$main--tabs-tool-width: 42px;
$main--tabs-header-height: 38px;
$main--tabs-header-shadow: 0 1px 0 0 rgba(0, 0, 0, .05);
$main--tabs-content-padding-x: 15px;
$main--tabs-content-padding-y: 15px;
$main--tabs-panel-padding-x: 15px;
$main--tabs-panel-padding-y: 15px;


/* Footer
------------------------------ */
$footer--height: 56px;
$footer--padding-x: 15px;
$footer--padding-y: 10px;
$footer--shadow: 0 -1px 0 0 rgba(0, 0, 0, .05);